<template>
    <div class="header">自动分析</div>
    <div class="container">
        <van-field v-model="value" placeholder="输入关键字进行检索" />
        <div class="search-info">
            <p>婚姻 财产</p>
            <p>车祸 受害者</p>
            <p>夫妻 共同财产</p>
            <p>遗产 继承</p>
            <p>个体工商户</p>
            <p>焦虑 悲伤</p>
        </div>

        <van-field
            v-model="message"
            rows="8"
            autosize
            
            type="textarea"
            placeholder="请输入文字"
        />
        <p class="btn">点击进行自我分析</p>
    </div>
</template>

<style scoped lang="less">
.header{
    width:100%;
    height:60px;
    color:white;
    background:#5A63AE;
    display:flex;
    align-items: center;
    justify-content: center
}
.btn{
    background:#5A63AE;
    color:white;
    width:100%;
    padding:15px 0;
    display:flex;
    align-items: center;
    justify-content: center;
    margin-top:20px;
}
.container{
    padding:15px;
    padding-bottom:60px;
}
.search-info{
    display:flex;
    width:100%;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:10px 0;
    margin-bottom:60px;
    p{
        width:110px;
        font-size:16px;
        margin-bottom:10px;
        text-align: center;
        color:gray;
    }
}
</style>